import React, { useContext, useEffect, useState } from 'react'
import { Spin, message } from 'antd';
import { Context } from '@/App';
import { addStudentInfor, deleteStudentInfor, reqStuStatus, reqstudentsInfor } from '@/api/api';
import { updateSearchInfor } from '@/tool/updateSearchInfor';
import { newBirthdayToStuStatus } from '@/tool/birthdayToStuStatus';
import './studentInfors.less'
import useAdditionalInfor from '@/hooks/useAdditionalInfor';

import ShowStudentInfor from '@/components/StudentInfors/ShowStudentInfor';
import AddNewStudent from '@/components/StudentInfors/AddNewStudent';
import StudentInforsList from '@/components/StudentInfors/StudentInforsList';
import StudentInforsSearch from '@/components/StudentInfors/StudentInforsSearch';
import StudentsUpload from '@/components/StudentInfors/StudentsUpload';



export default function StudentInfors() {
  const [open, setOpen] = useState(false);
  const [openUpload, setOpenUpload] = useState(false);
  const [showInfor, setShowInfor] = useState(false);
  const [showLoading, setShowLoading] = useState(true)
  const [loading, setLoading] = useState(true)

  const [studentsInfor, setStudentsInfor] = useState()
  const [searchInfor, setSearchInfor] = useState()
  const [stuStatus, setStuStatus] = useState()

  const { role } = useContext(Context)
  const { classes, professionals } = useAdditionalInfor(role)
  const additional = { classes, professionals }

  const getStudentsInfor = (data) => {
    setLoading(true)
    reqstudentsInfor(data).then(
      res => {
        if (res.status === 200) {
          setLoading(false)
          setStudentsInfor(res.data)
        }
      }
    )
  }

  useEffect(() => {
    getStudentsInfor()
  }, [])

  // 点击搜索后执行
  const onSearchFinish = (data) => {
    const values = updateSearchInfor(data)
    setSearchInfor(values)
    getStudentsInfor(values)
  };

  // 添加学生
  const addStudent = (values) => {
    addStudentInfor(values).then(
      res => {
        if (res.status === 200) {
          message.success(res.data);
        } else if (res.status === 201) {
          message.error("添加失败")
        }
        getStudentsInfor(searchInfor)
      }
    )
    setOpen(false);
  };

  // 学生信息
  const studentMessage = (data) => {
    getStudentInfor(data)
    setShowInfor(true);
  }

  const getStudentInfor = (role) => {
    setShowLoading(true)
    reqStuStatus(role).then(
      res => {
        if (res.status === 200) {
          setShowLoading(false)
          setStuStatus(newBirthdayToStuStatus(res.data))
        }
        if (res.status === 201) {
          message.error("没有找到该同学的信息")
        }
      },
    )
  }
  // 删除
  const deleteStudent = (data) => {
    console.log("删除信息", data);
    deleteStudentInfor({ fd_idNum: data["fd_idNum"] }).then(
      res => {
        if (res.status === 200) {
          message.success(res.data)
        }
        if (res.status === 201) {
          message.error("删除失败")
        }
        getStudentsInfor(searchInfor)
      }
    )
  }

  // 上传文件对话框
  const handleOk = () => {
    setOpenUpload(false);
  };

  const onClose = () => {
    setShowInfor(false);
  };

  return (
    <div className='studentInfors-box'>
      {
        loading ? <Spin size='large' className='loading' /> :
          <>
            <div className="studentInfors-select">
              <StudentInforsSearch
                onFinish={onSearchFinish}
                additional={additional}
                setOpen={setOpen}
                setOpenUpload={setOpenUpload}
              />
            </div>
            <div className='studentInfors-table'>
              <StudentInforsList
                deleteStudent={deleteStudent}
                studentMessage={studentMessage}
                studentsInfor={studentsInfor}
              />
            </div>
          </>
      }
      <AddNewStudent
        additional={additional}
        open={open}
        onCreate={addStudent}
        onCancel={() => {
          setOpen(false);
        }}
      />
      <StudentsUpload
        open={openUpload}
        onOk={handleOk}
        onCancel={() => {
          setOpenUpload(false);
        }}
      />
      <ShowStudentInfor
        showLoading={showLoading}
        open={showInfor}
        onClose={onClose}
        stuStatus={stuStatus}
      />
    </div>
  )
}
